<template>
	<div class="pages">
		<tabTitle title="任务下发"></tabTitle>
		<div class="backGround">
			<view class="item flex align-items " style="border-bottom: none;">
				<view class="item_left">下发数量 ：</view>
				<view class="item_right  flex align-items" @click="navTo(0)">
					<u-input v-model="obj.issueQuantity" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
		</div>
		<tabTitle title="任务处理"></tabTitle>
		<div class="backGround">
			<view class="item flex align-items " style="border-bottom: none;">
				<view class="item_left"> 处理数量 ：</view>
				<view class="item_right  flex align-items" @click="navTo(1)">
					<u-input v-model="obj.processingQuantity" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
		</div>
		<tabTitle title="下发记录"></tabTitle>
		<div class="backGround">
			<view class="item flex align-items " style="border-bottom: none;">
				<view class="item_left"> 下发层级 ：</view>
				<view class="item_right  flex align-items" @click="navTo(2)">
					<u-input v-model="obj.issueLevel" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
		</div>
		<tabTitle title="督办人信息"></tabTitle>
		<div class="backGround">
			<view class="item flex align-items ">
				<view class="item_left">督办人：</view>
				<view class="item_right  flex align-items" @click="templateBtn">
					<u-input v-model="obj.onusUserStr" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
			<view class="item flex align-items ">
				<view class="item_left">督办人部门：</view>
				<view class="item_right  flex align-items" @click="templateBtn">
					<u-input v-model="obj.deptStr" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
			<view class="item flex align-items " style="border: none;">
				<view class="item_left">下发时间：</view>
				<view class="item_right  flex align-items" @click="templateBtn">
					<u-input v-model="obj.issuedTime" placeholder="请选择" :fontSize="16" :readonly="true"
						placeholderClass="placeholderClass" style="pointer-events:none"></u-input>
					<u-icon name="arrow-right" color="#CCCCCC" :size="16"></u-icon>
				</view>
			</view>
		</div>
		<tabTitle title="督办信息"></tabTitle>
		<todoVue :form="obj" :ifReturn="true"></todoVue>
	</div>
</template>

<script>
	import {
		handlePeriodStr,
		handleLevelStr
	} from '@/utils/newMap.js'
	import tabTitle from '@/components/tabTitle.vue'
	import todoVue from './components/to-do.vue'
	import {
		getInfo

	} from '@/api/supervise.js'
	export default {
		components: {
			tabTitle,
			todoVue
		},
		data() {
			return {
				handlePeriodStr,
				handleLevelStr,
				form: {
					name: '',
					num: 0
				},
				loading: false,
				id: '',
				obj: {}
			}
		},
		onLoad(option) {
			this.id = option.id
			uni.removeStorageSync("list")
			this._getInfo()
		},
		methods: {
			_getInfo() {
				getInfo({
					id: this.id,
				}).then(res => {
					console.log(res);
					res.datas.fileUrl = res.datas.fileUrl ? JSON.parse(res.datas.fileUrl) : ''
					res.datas.handleLevelStr = this.handleLevelStr.get(res.datas.handleLevel - 0)
					res.datas.handlePeriodStr = this.handlePeriodStr.get(res.datas.handlePeriod - 0)
					this.obj = res.datas
					if(res.datas.listVo.length>0){
						uni.setStorageSync('list',JSON.stringify(res.datas.listVo))
					}
				})
			},
			templateBtn() {

			},
			comit() {

			},
			navTo(type) {
				if (type == 0) {
					this.jumpTo('/pages/supervise/task', {
						type: 2
					})
				} else if (type == 1) {
					this.jumpTo('/pages/supervise/processingRecords',{
						id:this.obj.id
					})
				} else if (type == 2) {
					this.jumpTo('/pages/supervise/IssuanceRecord',{
							id:this.obj.id
					})
				}
			}

		}
	}
</script>
<style>
	page {
		background-color: #F6F6F6;
	}
</style>
<style lang="scss" scoped>
	.item {
		min-height: 100rpx;
		border-bottom: 1rpx solid #E6E6E6;
		padding: 0 31rpx;

		&_left {
			// width: 220rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 33rpx;
			line-height: 47rpx;
			text-align: left;
			font-style: normal;
			color: #666666;
		}

		&_left::before {
			content: '*';
			color: #FF0000;
		}

		&_right {
			flex: 1;

			/deep/.u-input {
				height: 65rpx;
				margin: 0 auto;
				font-size: 16rpx;
			}
		}

		&_fu {
			width: 196rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 33rpx;
			line-height: 47rpx;
			text-align: left;
			font-style: normal;
			color: #666666;
		}

		&_upload {
			width: 240rpx;
			height: 60rpx;
			background: #267DFF;
			text-align: center;
			line-height: 60rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 29rpx;
			color: #FFFFFF;
		}

	}

	.backGround {
		background-color: #FFF;
		padding-bottom: 5rpx;
	}

	.btn {
		background: #267DFF;
		width: 90%;
		height: 89rpx;
		text-align: center;
		line-height: 89rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 29rpx;
		color: #FFFFFF;
		margin: 0 auto;
		margin-top: 30rpx;
	}
</style>